<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>clone 克隆</title>
</head>
<body>
<script>
<!--  浅层clone  -->
/*
    var obj = {
        name : "abc",
        age : 18,
        sex : "male",
        arr : ['han','lu','yuan']
    };
    var obj1 = {};

    function clone(origin,target) {
        var target = target || {};
        for(prop in origin){
            target[prop] = origin[prop];
        }
        return target;
    }
    clone(obj,obj1);
    //console.log(obj1);
    // Object age: 18 arr: (3) ["han", "lu", "yuan"] name: "abc" sex: "male" __proto__: Object

    //改变obj1的name，obj的name不会受影响
    obj1.name = "long";

    console.log(obj);
    //name: "abc", age: 18, sex: "male", arr: (3) ["han", "lu", "yuan"]

    console.log(obj1);//
    ////name: "long", age: 18, sex: "male", arr: (3) ["han", "lu", "yuan"]

    //改变obj1的arr，obj的arr会受影响    arr 是引用值
    obj1.arr.push("long");

    console.log(obj);
    //name: "abc", age: 18, sex: "male", arr: (4) ["han", "lu", "yuan", "long"]

    console.log(obj1);
    //name: "abc", age: 18, sex: "male", arr: (4) ["han", "lu", "yuan", "long"]

*/



//?????怎么使clone出来的东西改变不影响到被克隆的东西呢，也就是克隆之后不受影响。


    //使用原始值拷贝就拷贝  是引用值就分析 是数组键数组 是对象键对象
    // var obj = {
    //     name : "abc",
    //     age : 18,
    //     sex : "male",
    //     card : ['han','lu','yuan',[1,2]]
    // };
    // var obj1 = {
    //     card: [obj.card[0],obj.card[1],obj.card[2],[]]
    // }



//实现clone后互不干扰
//     0.遍历对象  for(var prop in obj)
//     1.判断是不是引用值   typeof() 如果是obj 是引用值，如果不是obj 就是原始值（null先忽略）
//     2.判断是数组还是对象  instanceof toString constructor
//     3.建立相应的数组或者对象
//     4.递归

    var obj = {
        name : "abc",
        age : 123,
        card : ['han','lu'],
        wife : {
            name : "fang",
            son : {
                name : "xiaoming"
            }
        }
    };
    var obj1 = {};

    function deepClone(origin,target) {
        var target = target || {};
        var toStr = Object.prototype.toString;
        var arrStr = "[object Array]";
        for(var prop in origin){
            if(origin.hasOwnProperty(prop)){
                if(origin[prop] !== null && typeof(origin[prop]) == 'object'){//1.判断是不是引用值
                    if(toStr.call(origin[prop]) == arrStr){//2.判断是数组还是对象
                        target[prop] = [];
                    }else {
                        target[prop] = {};
                    }
                    deepClone(origin[prop],target[prop]);
                }else {
                    target[prop] = origin[prop];
                }
            }
        }
        return target;
        //没有传target 就把它 return出去
    }
    deepClone(obj,obj1);
    console.log(obj1);
// age: 123
// card: Array(2)
// 0: "han"
// 1: "lu"
// length: 2
// name: "abc"
// wife:
//     name: "fang"
// son:
//     name: "xiaoming"
    obj1.card.push("long");
    console.log(obj1);
    //card: (3) ["han", "lu", "long"]
    console.log(obj);
    //card: (2) ["han", "lu"]

</script>
</body>
</html>
